<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <form>
        <input type="text" id="username" name="username">
        <input type="text" id="password" name="password">
        <button type="submit">点击</button>
    </form>
    <script>
        const btn = document.querySelector('button')
        btn.onsubmit = (e) => {
            e.preventDefault()
            const formData = new FormData()
            const username = formData.get('username')
            const password = formData.get('password')
            fetch('http://ajax-api.itheima/api/login', {
                method: 'POST',
                headers: {
                    'content-type': 'application/json'
                },
                body: JSON.stringify({
                    username,
                    password
                })
            }).then(res => res.json())
                .then(res => console.log(res))
        }

    </script>
</body>

</html>